<template>
  <div>
    <code-editor ref="queryRef" :config="{language:'mysql'}" style="height: 200px"></code-editor>
    <div style="text-align: center">
      <el-button type="success" @click="updateOut" icon="el-icon-circle-check">更新配置</el-button>
    </div>
    <code-editor ref="scriptRef" :config="{language: 'java'}" :style="{height: autoHeight }"></code-editor>
  </div>
</template>
<script>
import CodeEditor from "@/components/codeEditor/CodeEditor.vue";

/**
 * <p>
 * 作用描述
 * </p>
 *
 * @author 62688
 * @since  2024/8/4 0:07
 */
export default {
  name: "ExcelOutBefore",
  components: {CodeEditor},
  inject: {
    excelTemplate: {
      from: 'excelTemplate',
      default: function () {
        return { sheets: [], excelId: '0', excelOut: {} }
      }
    }
  },
  computed: {
    autoHeight(){
      return `calc(100vh - 545px)`
    }
  },
  created() {
    setTimeout(() => {
      this.apdateRef(true)
    }, 500)
  },
  methods: {
    apdateRef(set) {
      const $query = this.$refs.queryRef
      const $script = this.$refs.scriptRef
      if (set) {
        $query.setValue(this.excelTemplate.excelOut.beforeSql || '', 'mysql')
        $script.setValue(this.excelTemplate.excelOut.beforeScript || '', 'java')
      } else {
        this.$set(this.excelTemplate.excelOut, 'beforeSql', $query.code)
        this.$set(this.excelTemplate.excelOut, 'beforeScript', $script.code)
      }
    },
    updateOut() {
      this.apdateRef(false)
      this.$post('excelOut/save', this.excelTemplate.excelOut)
          .then(res => {
            this.$resultMsg(this, res)
            this.$emit('refreshOut')
          })
    }
  }
}
</script>

<style scoped>

</style>